import cn from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import Button from '@kuiper-components/button';
import s from './style.module.css';
import img from './img.png';

function Success({ className, target }) {
	return (
		<div className={cn(className, s.success)}>
			<div className={s.imgContainer}>
				<img src={img} />
			</div>
			<div className={s.result}>{target} 认证成功！</div>
			<p className={s.desc}>
				您可以一键开启云监测服务，知道创宇云监测已为您默认配置一些服务，或者您可以前往
				<span className={s.highLight}>自定义配置</span>。
			</p>
			<div className={s.btnContainer}>
				<Button className={s.btn} size="small">
					确定
				</Button>
				<Button className={s.btn} size="small" primary>
					一键开启
				</Button>
			</div>
		</div>
	);
}

Success.propTypes = {
	className: PropTypes.string,
	target: PropTypes.string,
};
Success.defaultProps = {
	className: '',
};

export default Success;
